import React from 'react';
import {
  View,
  Text,
  ScrollView,
  TouchableOpacity,
  Alert,
} from 'react-native';

import SizeUtils from '../../common/SizeUtils';
import Config from '../../config';
import TImage from '../../components/TImage';
import BasePage from '../common/BasePage';
import ToastUtils from '../../common/ToastUtils';
import HeartRequestExpertDataAction from "../../actions/heart/HeartRequestExpertDataAction";

//
export default class HeartExpertDataPage extends BasePage {
  constructor(props) {
    super(props);

    this.state.zhuanjiaData = this.props.pageData.routeData;
    //type = 1表示预约咨询 2 秘密留言
    // this.state.zhuanjiaData = {expert_id:"594e3375ffc3c45f42516f56",type:1};
    this.state.type = this.state.zhuanjiaData.type;
  }

  _dealEnterPage() {
    if(this.props.pageData && this.props.pageData.routeData && this.state.zhuanjiaData.expert_id != this.props.pageData.routeData.expert_id){
        this.state.zhuanjiaData = this.props.pageData.routeData;
        this.state.type = this.state.zhuanjiaData.type;
        this._requestData();
    }
  }

  componentDidMount() {
    this._requestData();
  }

  render() {
    return (
      <View style={{width:SizeUtils.getWindowSize().width,paddingTop:Config.paddingTop,
          height:SizeUtils.getWindowSize().height, backgroundColor:"#ffffff"}}>
        <ScrollView style={{flex:1,
           height:SizeUtils.getWindowSize().height - Config.paddingTop - SizeUtils.translateDesignHeightToCode(100),}}>
          <View style={{width:SizeUtils.getWindowSize().width - SizeUtils.translateDesignWidthToCode(80),
              marginLeft:SizeUtils.translateDesignWidthToCode(40),
              flexDirection:"column", alignItems:"center"}}>
            {this._renderShowImage()}
            {this._renderName()}
            {this._renderDesc1()}

          </View>
        </ScrollView>
        {this._renderBottom()}
        {this._renderNavigationBar()}
      </View>
    )
  }

  _renderShowImage() {
    return (
        <TImage source={this._getShowImage()} style={{marginTop: SizeUtils.translateDesignHeightToCode(40), width:670, height:340}}/>
    )
  }

  _renderBottom(){
    return (<TouchableOpacity
            style={{
              width:SizeUtils.getWindowSize().width,
              backgroundColor: '#D93338',
              height:SizeUtils.translateDesignHeightToCode(100),
              flexDirection:"row", justifyContent:"center",
              alignItems:"center",
            }}
            onPress={this._onPressSubmit.bind(this)}
           >
             <Text style={{
                textAlign: 'center',
                color: '#ffffff',
                fontSize:SizeUtils.translateFontSizeToCode(32),
              }}>{  this.state.zhuanjiaData.duty == 0?"今日不是该专家值班哦":"私密留言"}</Text>
           </TouchableOpacity>);
  }

  _onPressSubmit(){
    if(this.state.type == 1){
       this.gotoPage(Config.pages.heart_consult,this.state.zhuanjiaData);
    }
    else {
      this.state.zhuanjiaData.msguser_id = this.state.zhuanjiaData.expert_id;
      //1是爱情事 2是秘密留言
      this.state.zhuanjiaData.type = 2;
      this.gotoPage(Config.pages.heart_secret_msg_chat, this.state.zhuanjiaData);
    }
  }

  _getShowImage() {
    if(this.state.zhuanjiaData.image_urls != undefined && this.state.zhuanjiaData.image_urls[0].length > 0) {
      return {uri:this.state.zhuanjiaData.image_urls[0]};
    }
    return {uri:""}
  }

  _renderDesc1() {
    return (
      <View style={{width:SizeUtils.getWindowSize().width - SizeUtils.translateDesignWidthToCode(80),
          marginTop:SizeUtils.translateDesignHeightToCode(20),
          paddingBottom:SizeUtils.translateDesignHeightToCode(40),
          alignItems:"center",}}>
          <View style={{width:SizeUtils.getWindowSize().width - SizeUtils.translateDesignWidthToCode(80),
           height:1,backgroundColor:"#cccccc", position:"absolute",
            top:SizeUtils.translateDesignHeightToCode(14)}}></View>
          <Text style={{fontSize:SizeUtils.translateFontSizeToCode(28), color:"#333333",backgroundColor:"#ffffff",
             paddingLeft:SizeUtils.translateDesignWidthToCode(16),paddingRight:SizeUtils.translateDesignWidthToCode(16) }}>
             专家简介
          </Text>
          <Text style={{color:"#999999", fontSize:SizeUtils.translateFontSizeToCode(28),
          marginTop:SizeUtils.translateDesignHeightToCode(38),}}>
            {this.state.zhuanjiaData.desc1}
          </Text>
      </View>
    )
  }

  //  _renderDesc2() {
  //   return ( <View style={{width:SizeUtils.getWindowSize().width - SizeUtils.translateDesignWidthToCode(80),
  //         marginLeft:SizeUtils.translateDesignWidthToCode(40),
  //         paddingTop:SizeUtils.translateDesignHeightToCode(40),
  //         paddingBottom:SizeUtils.translateDesignHeightToCode(40),
  //         borderColor:"#eeeeee",
  //         borderWidth:SizeUtils.translateDesignNumToCode(3),
  //         paddingLeft:SizeUtils.translateDesignWidthToCode(20)}}>
  //         <Text style={{color:"#999999", fontSize:SizeUtils.translateFontSizeToCode(28),}}>
  //           {this.state.zhuanjiaData.desc2}
  //         </Text>
  //     </View>
  //   )
  // }

  _renderName() {
    return (
      <View style={{width:SizeUtils.getWindowSize().width - SizeUtils.translateDesignWidthToCode(80),
          paddingTop:SizeUtils.translateDesignHeightToCode(50),
          paddingBottom:SizeUtils.translateDesignHeightToCode(40),
          alignItems:"center",}}>
          <Text style={{fontSize:SizeUtils.translateFontSizeToCode(28), color:"#333333"}}>
              {this.state.zhuanjiaData.name}
          </Text>
          <Text style={{paddingTop: SizeUtils.translateDesignHeightToCode(10),color:"#999999", fontSize:SizeUtils.translateFontSizeToCode(28),}}>
            {this.state.zhuanjiaData.title}
          </Text>
      </View>
    )
  }

  _requestData() {
    new HeartRequestExpertDataAction().call(this, this.state.zhuanjiaData);
  }

}
